<html lang="en">
<head>
    <%- include('../../_global/baseLibs') %>
    <title>登录</title>
    <link rel="stylesheet" href="/static/css/login.css"/>
    <script src="/quickJs/scripts/common/md5.js"></script>
    <style>
        .check-box {
            width: 1.1rem;
            height: 1.1rem;
            margin: 0;
            vertical-align: middle;
        }

        .check-box-div {
            width: 100%;
            height: 30px;
            position: relative;
            top: -2rem;
        }

        .checkLeft {
            position: absolute;
            left: 0;
        }

        .checkRight {
            position: absolute;
            right: 0;
        }
    </style>
</head>
<body>
<section class="page-wrap page-user-info">
    <!-- header start -->
    <header class="header-box grey fixed">
        <div class="header-content">
            <div class="title">账号登录</div>
        </div>
    </header>
    <!-- header end -->
    <section class="login-content">
        <aside class="logo"></aside>
        <aside class="login-form-box">
            <form id="formLogin" autocomplete="off">
                <ul class="login-form">
                    <li>
                        <input id="username" name="USERNAME" class="input-text form-control" placeholder="请输入手机号"
                               type="text" value="" autocomplete="false"
                               quick-config="label:请输入手机号', validateProxy:'notNull length', length: '20'">
                        <i class="icon-form-tool icon-form-close" style="display: none"></i>
                    </li>
                    <li>
                        <input id="password" class="input-text form-control" placeholder="请输入密码" type="password"
                               value="" autocomplete="false"
                               quick-config="label:'密码', validateProxy:'notNull length', length: '20'">
                        <input id="hexPwd" name="PASSWORD" style="display: none;">
                        <i id="changePasState" class="icon-form-tool icon-eyes"></i>
                    </li>
                </ul>
            </form>
            <div class="check-box-div">
                <div class="checkLeft">
                </div>
                <div class="checkRight">
                    <input type="checkbox" class="check-box" id="isAutoLogin">自动登录
                </div>
            </div>
            <div class="tool-box" style="position: relative">

                <div>
                    <a id="btnLogin" class="button button-primary" href="javascript:void(0);">登 录</a>
                </div>
                <p class="p-tool clearfix">
                    <a id="btnFogetPassword" class="color-link" href="javascript:void(0);">忘记密码</a>
                    <a id="btnRegister" class="color-link register-link" href="javascript:void(0);">注册</a>
                </p>
            </div>
        </aside>
        <!--<aside class="other-login">-->
            <!--<h4 class="title"><span class="name">第三方账号登录</span></h4>-->
            <!--<ul class="login-list">-->
                <!--<li><a title="微信" href="javascript:void(0);"><i class="icon icon-login-wx"></i></a></li>-->
                <!--<li><a title="腾讯QQ" href="javascript:void(0);"><i class="icon icon-login-qq"></i></a></li>-->
                <!--<li><a title="新浪微博" href="javascript:void(0);"><i class="icon icon-login-wb"></i></a></li>-->
            <!--</ul>-->
        <!--</aside>-->
    </section>
</section>
</body>
<script type="text/javascript">

    var domainKey = "<%= domainKey %>";
    var page_login = (function($, page_login) {
        /*登录地址*/
        var uri_service_login = '/api/gzd/ignore/login';
        var cfg_def = {
            /*登录按钮回调*/
            btnLoginClickHandler: btnLoginClickHandler
            /*登录请求*/
            ,login: login
            /*登录参数设置*/
            ,loginPamrams: loginPamrams
            /*登录成功回调*/
            ,loginHandler: loginHandler
            /*注册按钮回调*/
            ,registerBtnClickHandler: registerBtnClickHandler
            /*忘记秘密按钮回调*/
            ,btnFogetPasswordClickHandler: btnFogetPasswordClickHandler
        }

        page_login.init = function(cfg){
            $.extend(page_login, cfg_def, cfg);
            $.removeCookie(domainKey, {path: "/"});
            $("#btnLogin").on("click", page_login.btnLoginClickHandler);
            $("#btnRegister").on("click", page_login.registerBtnClickHandler);
            $("#btnFogetPassword").on("click", page_login.btnFogetPasswordClickHandler);
            innerInit();
        }

        /*初始化页面一般操作*/
        function innerInit(){
            $("#username").on('focus', function () {
                $(this).parent().find('.icon-form-close').show();
            });
            $("#username").on('blur', function () {
                if ($(this).val() != "" && $(this).val() != undefined) {
                    $(this).parent().find('.icon-form-close').show();
                } else {
                    $(this).parent().find('.icon-form-close').hide();
                }
            });

            $(".icon-form-close").on('click', function () {
                $(this).parent().find('.input-text').val("");
            });

            $("#changePasState").click(function () {
                if ($(this).hasClass('active')) {
                    $(this).removeClass('active');
                    $('#password').attr('type', 'password');
                } else {
                    $('#password').attr('type', 'text');
                    $(this).addClass('active');
                }
            });
        }

        /*登录按钮回调*/
        function btnLoginClickHandler() {
            page_login.login.apply(this);
        }

        /*注册按钮回调*/
        function registerBtnClickHandler() {
            $.pageSwitch.goToUrl("beforLogin","register");
        }

        /*忘记密码回调*/
        function btnFogetPasswordClickHandler() {
            $.pageSwitch.goToUrl("beforLogin","forgetPwd");
        }
        function login() {
            if ($(".form-control").QuickValidate()) {
                $("#hexPwd").val(hex_md5($("#password").val()));
                var username = $("#username").val();
                var password = $("#hexPwd").val();

                var data = {
                    username: username,
                    password: password
                };

                data = page_login.loginPamrams(data);

                $.QuickRemote.AjaxJson({
                    funcName: uri_service_login
                    , params: data
                    , callback: function (result) {
                        if(page_login.loginHandler){
                            page_login.loginHandler.apply(this, [result]);
                        }
                    }
                })
            }
        }
        function loginPamrams(data){
            return data;
        }
        function loginHandler(result){

        }
        return page_login;
    })(jQuery, {});
</script>

</html>